import React from 'react';
import { observer, inject } from "mobx-react";
import { Modal, message } from 'antd';
import TaskInfo from '../task/taskInfo';
import TaskRemind from '../task/taskRemind';
import TaskMember from '../task/taskMember';
import TaskMaterial from '../task/taskMaterial'

export const styles = {
    content: {
        padding: '5px 20px',
        maxHeight: '75vh',
        overflowY: 'auto',
        overflowX: 'hidden',
    }
}

@inject(({ taskState, userState, commonState }) => ({ taskState, userState, commonState }))
@observer
class CreateTaskModal extends React.Component {

    state = {
        confirmLoading: false
    }

    handleOk = () => {
        const { onCancel, taskState: { createTask } } = this.props;
        const { taskInfo, taskRemind, taskMember, taskMaterial } = this;
        const { projectid, stageid, ...info } = taskInfo.getValue();

        if (!info.content) {
            message.warn('请输入任务内容！');
            return;
        }

        this.setState({ confirmLoading: true });
        const reminders = taskRemind.getValue();
        const members = taskMember.getValue();
        const files = taskMaterial.getValue();
        if (!reminders.length) {
            message.warn('请设置提前时间');
            this.setState({ confirmLoading: false });
			return;
        }
        
        createTask({
            taskid: null,
            projectid: projectid || '',
            stageid: stageid || '',
            info: { ...info, contenttype: 0 },
            reminders,
            members,
            files
        }, () => {
            // 回复默认值
            taskInfo.setBaseValue({});
            taskRemind.setBaseValue([]);
            taskMember.setBaseValue({});
            taskMaterial.setBaseValue({});
            this.setState({ confirmLoading: false }, onCancel);
        })
    }

    handleCancel = () => {
        const { onCancel } = this.props;
        const { taskInfo, taskRemind, taskMember, taskMaterial } = this;
        // 回复默认值
        taskInfo.setBaseValue({});
        taskRemind.setBaseValue([]);
        taskMember.setBaseValue({});
        taskMaterial.setBaseValue({});
        onCancel();
    }

    render() {
        const { show, taskState, commonState } = this.props;
        const { repeatList, aheadList, alarmTaskList } = taskState;
        const { info } = this.props.userState;
        return (
            <Modal
                title="新建任务"
                maskClosable={false}
                centered
                width={700}
                visible={show}
                okText="确定"
                cancelText="取消"
                onOk={this.handleOk}
                onCancel={this.handleCancel}
                confirmLoading={this.state.confirmLoading}
                wrapClassName={'customizeWrapModal'}
            >
                <div style={styles.content}>
                    <TaskInfo create ref={d => this.taskInfo = d} alarmTaskList={alarmTaskList} commonState={commonState} />
                    <TaskRemind create ref={d => this.taskRemind = d} repeatList={repeatList} aheadList={aheadList} />
                    <TaskMember create ref={d => this.taskMember = d} info={info} />
                    <TaskMaterial create ref={d => this.taskMaterial = d} />
                </div>
            </Modal>
        );
    }
}

export default CreateTaskModal